<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>async和await的基本用法</title>
</head>
<body>
  
</body>
<script>
  function aFunc(){
    console.log("这是一个普通的函数");
  }
  aFunc();
  console.log(aFunc);
  // 1. async 
  // 将一个 普通函数编程一个异步函数 被 async 修饰的函数 会返回一个 Promise对象
  async function bFunc(){
    console.log("这是被async 修饰的函数，这个函数会变成异步函数");
    // 这只是从字面上来告诉使用者，这个函数是用来处理异步任务的功能函数
    // return "这是正确执行的返回结果"
    return {msg: "这是返回信息", code:200};
  }

  console.log(bFunc());
  // async 的用法
  bFunc().then( data => {
    console.log(data);
  });

  // 需求的解决方案 
  function request(num){// 模拟请求接口
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve(num * 2);
      }, 1000);
    });
  }

  request(1).then( data => {
    console.log(data); // 1秒后 输出2
    request(2).then( data2 => {
      console.log(data2); // 2秒后 输出4
    });
  });

  // 使用 async 和 await 来解决 方案 增加一个需求： 接口2 需要使用 接口1的结果
  async function cFunc(){
    console.log('begin.......');
    let data1 = await request(3);
    console.log(data1);//1s后输出 6
    let data2 = await request(data1);
    console.log(data2);//2s后输出 12
    console.log('over.......');
  }

  cFunc();
  console.log('主程序执行完毕');



</script>
</html>